<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
    <link rel="stylesheet" type="text/css" href="https://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css">
<body>
    <div class="container">
        <dir class="row">
            <div class="col-md-6 col-md-offset-3">
				<table class="table table-bordered table-striped table-hover table-condensed">
				  <tr class="success">
				  	<th>
  			     	    <label>
							<!-- 这里的 $event 是将当前对象传入进去，具体详情请参照vue官方文档 -->
							<input type="checkbox" id="allAndNotAll" />全选/反选<br><br>
						</label>
				  	</th>
				    <th>Month</th>
				    <th>Savings</th>
				    <th>Month</th>
				  </tr>
				  <tr class="danger">
				  	<td>
						<label>
				            <!-- v-model 双向数据绑定命令 -->
				            <input type="checkbox" name=items id="001"/>刘德华
				        </label>
				  	</td>
				    <td>January</td>
				    <td>$100</td>
				    <td>$100</td>
				  </tr>
				  <tr class="danger">
				  	<td>
						<label>
				            <input type="checkbox" name=items id="002"/>张学友
				        </label>
				  	</td>
				    <td>January</td>
				    <td>$100</td>
				    <td>$100</td>
				  </tr>
				  <tr class="danger">
				  	<td>
						<label>
				            <input type="checkbox" name=items id="004"/>郭富城
				        </label>
				  	</td>
				    <td>January</td>
				    <td>$100</td>
				    <td>$100</td>
				  </tr>
				</table>
            </div>
        </dir>
    </div>


</body>
<script type="text/javascript" src="../jquery/jquery.min.js"></script>
<script type="text/javascript">
	$(function(){
		//实现全选与反选
		$("#allAndNotAll").click(function() { 
			if (this.checked){  
		        $("input[name='items']:checkbox").each(function(){ 
		              $(this).attr("checked", true);  
		        });
		    } else {   
		        $("input[name='items']:checkbox").each(function() {   
		              $(this).attr("checked", false);  
		        });
		    }  
		});
		
		//获取被选中的id
		var ids=[];
		$('#getAllSelectedId').click(function(){
			$("input[name='items']:checked").each(function(){ 
	              ids.push($(this).attr("id"));  
	        });
			
			var delIds=ids.join(","); 
			console.log(delIds);
			
			//可以将delIds通过jquery ajax传到后台了,在后台采用String接收这个delIds参数,然后采用split(",")分隔得到一个
			//String[]的id数组。可以参考我的博客：http://blog.csdn.net/u013871100/article/details/52740061
			
		});
	});
</script>
</html>

